<template>
  <view class="content">
    <roc-navbar title="工作台" :autoBack="false"></roc-navbar>
    <view class="u-p-10">
      <view v-for="(item, index) in routes" :key="index">
        <roc-title :title="item.title"></roc-title>
        <u-grid col="4">
          <u-grid-item v-for="(route, routeIndex) in item.children" :key="routeIndex" @click="handleToPage(route.path)">
            <roc-icon-plus :name="route.icon" :size="36" color="#3c9cff"></roc-icon-plus>
            <text class="grid-text">{{ route.title }}</text>
          </u-grid-item>
        </u-grid>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      /**
       * routes 分为两级
       * 第一级：页面路由分类标题
       * 第二级：页面路由信息
       */
      routes: [
        {
          title: '基础管理',
          children: [
            {
              icon: 'file-alt',
              title: '用户管理',
              path: '/pages/rocUser/index',
            },
          ],
        },
      ],
    }
  },
  onShow() {
    this.authToLogin()
  },
  methods: {
    /**
     * 转跳页面
     * @param {Object} path
     */
    handleToPage(path) {
      uni.navigateTo({
        url: path,
      })
    },
  },
}
</script>

<style lang="scss" scoped>
.u-empty {
  padding-top: 100px;
}
.grid-text {
  font-size: 14px;
  color: #606266;
  padding-top: 6px;
  box-sizing: border-box;
}
.u-grid-item {
  padding: 10px 0;
  border: 1px solid rgba(0, 0, 0, 0.06);
}
</style>
